import { createRouter, createWebHistory } from 'vue-router'
import { ElMessage } from 'element-plus'
import HomeView from '../views/Home.vue'
// import ConferenceList from '../views/conference/ConferenceList.vue'
import ConferenceDetail from '../views/conference/ConferenceDetail.vue'

// 导入登录和注册组件
import Login from '../views/Login.vue'
import Register from '../views/Register.vue'

const routes = [
  {
    path: '/',
    name: 'home',
    component: HomeView
  },
  {
    path: '/conferences',
    name: 'Conferences',
    component: () => import('@/views/conference/ConferenceList.vue'),
    meta: { 
      requiresAuth: true,
      permissionId: 1, // 需要会议组织者权限
      title: '会议列表'
    }
  },
  {
    path: '/dashboard',
    name: 'Dashboard',
    component: () => import('@/views/dashboard/Dashboard.vue'),
    meta: { 
      requiresAuth: true,
      permissionId: 0, // 参会人员权限
      title: '参会人员中心',
      hideNav: true
    }
  },
  {
    path: '/personal-center',
    name: 'PersonalCenter',
    component: () => import('@/views/PersonalCenter.vue'),
    meta: {
      requiresAuth: true  // 需要登录才能访问
    }
  },
  {
    path: '/conference/:id',
    name: 'ConferenceDetail',
    component: ConferenceDetail,
    meta: { 
      requiresAuth: true,
      title: '会议详情'
    }
  },
  {
    path: '/statistics',
    name: 'ConferenceStatistics',
    component: () => import('../views/statistics/ConferenceStatistics.vue'),
    meta: { 
      requiresAuth: true, 
      permissionId: 1,
      title: '会议统计'
    }
  },
  {
    path: '/mobile/:id',
    name: 'MobileDetail',
    component: () => import('../views/conference/MobileDetail.vue'),
    meta: {
      // requiresAuth: true,
      // permissionId: 1,
      title: '会议统计'
    }
  },
  {
    path: '/login',
    name: 'Login',
    component: Login, // 使用直接导入的组件
    meta: { title: '用户登录' }
  },
  {
    path: '/register',
    name: 'Register',
    component: Register, // 使用直接导入的组件
    meta: { title: '用户注册' }
  }
]

const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes
})

// 添加全局导航错误处理
router.onError((error) => {
  console.error('路由错误:', error)
  ElMessage.error('导航过程中发生错误，请刷新页面重试')
})

// 路由守卫
router.beforeEach((to, from, next) => {
  // 设置页面标题
  document.title = to.meta.title ? `${to.meta.title} - 会议管理系统` : '会议管理系统'
  
  console.log(`路由跳转: 从 ${from.path} 到 ${to.path}`)
  
  const userInfo = localStorage.getItem('userInfo')
  const token = localStorage.getItem('token')

  // 检查是否需要认证
  if (to.matched.some(record => record.meta.requiresAuth)) {
    if (!token || !userInfo) {
      ElMessage.warning('请先登录')
      next({
        path: '/login',
        query: { redirect: to.fullPath }
      })
      return
    }

    const user = JSON.parse(userInfo)
    
    // 检查权限ID
    if (to.meta.permissionId !== undefined && to.meta.permissionId !== user.permissionId) {
      ElMessage.error('您没有权限访问该页面')
      next({ path: '/' })
      return
    }
    
    next()
  } else {
    // 如果已登录且访问登录/注册页面，重定向到首页
    if ((to.path === '/login' || to.path === '/register') && token && userInfo) {
      next({ path: '/' })
      return
    }
    next()
  }
})

const goToDashboard = () => {
  router.push('/personal-center')
}

export default router 